/*
 * 面向属性的 CSS
 */

/* 布局方式 */
.df {
    display: flex;
}

.fdcolumn {
    flex-direction: column;
}

.flex {
    flex: 1;
}

.overflow {
    overflow: scroll;
}

/* 定位 */
.abs {
    position: absolute;
}

.rel {
    position: relative;
}

/* 文本居中 */
.tcenter {
    text-align: center;
}

/* 字本大小 */
.font12 {
    font-size: 12px;
}

.font14 {
    font-size: 14px;
}

.font16 {
    font-size: 16px;
}

.font18 {
    font-size: 18px;
}

.font20 {
    font-size: 20px;
}

.font22 {
    font-size: 22px;
}

/* 字体颜色 */
.c10 {
    color: #101010;
}

.cfff {
    color: #fff;
}

.a8a{
    color: #8a8a8a;
}

.f42{
    color: #4294FF;
}

.aad9{
    color: #AAD9F7;
}

/* 变怪异盒子 */
.borbox{
    box-sizing: border-box;
}
/* 内边距 */
.pad{
    padding: 20px;
}

/* 背景颜色 */
.bfff{
    background-color: #fff;
}

.bg42{
    background-color: #4294FF;
}

/* 整体布局内边距 */
.pb20{
    padding: 10px 20px;
}